<template>
  <div class="copyright">
    <div class="nav">
      <a class="nav-item">首页</a>
      <a class="nav-item">隐私保护</a>
      <a class="nav-item">隐私保护</a>
      <a class="nav-item">隐私保护</a>
      <a class="nav-item">隐私保护</a>
      <a class="nav-item">隐私保护</a>
    </div>
    <div class="copyright-text">
      <span>Copyright ©2021 广东道多多商贸有限公司版权所有</span>
      <a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">
        粤ICP备2021004993号-1
      </a>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
.copyright {
  padding: 40px 0;
  .copyright-text {
    text-align: center;
    margin-top: 20px;
    span {
      display: inline-block;
      padding-right: 30px;
    }
    a {
      color: inherit;
    }
  }
  .nav {
    text-align: center;
    font-size: 0;
    .nav-item {
      display: inline-block;
      font-size: 16px;
      margin: 0 20px;
      position: relative;
      color: #cccccc;
      cursor: pointer;
      &:hover {
        color: #fff;
      }
      &::after {
        content: "";
        display: block;
        position: absolute;
        top: 1px;
        bottom: 0;
        width: 1px;
        background: #fff;
        right: -20px;
      }
      &:last-child::after {
        display: none;
      }
    }
  }
}
</style>
